<script type="text/javascript" src="<?= UriParser::getBaseUri() ?>view/_templates/js/serialize.js"></script>

<!-- FUNCIÓN MANEJADORA del ENVÍO DEL FORMULARIO -->
<script type="text/javascript">
var conexion;

function crearParticipante() {
	var formulario = document.getElementById('idFormDpto');
	var datosSerializados = serialize(formulario);
	conexion = new XMLHttpRequest();
	conexion.open('POST', '<?= UriParser::getBaseUri() ?>Departamento/crear', true);
	conexion.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
	conexion.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	conexion.send(datosSerializados);
	conexion.onreadystatechange = function() {
		if (conexion.readyState==4 && conexion.status==200) {
			accionAJAX();
		}
	}
}

		
function accionAJAX() {
	textoRecibido = conexion.responseText;
	document.getElementById("idFooter").innerHTML=textoRecibido;
}	

</script>

<!--------------------------------------------->
<h3>NUEVO PARTICIPANTE</h3>
<form>
	<label for="idFNombre">Nombre</label>
	<input type="text" id="idFNombre" name="nombre">

	<label for="idFEdad">Edad</label>
	<input type="text" id="idFEdad" name="edad">
	
	<fieldset>
	<legend >Categoría</legend>
		<input type="radio" id="idRAlevin" name="categoria" value="alevin" checked="checked">
		<label for="idRAlevin">Alevín</label><br/>
		
		<input type="radio" id="idRInfantil" name="categoria" value="infantil">
		<label for="idRInfantil">Infantil</label><br/>

		<input type="radio" id="idRjuvenil" name="categoria" value="juvenil">
		<label for="idRJuvenil">Juvenil</label><br/>

	</fieldset>
	
	<input type="button" value="Enviar" class="button" onclick="crearParticipante()">
</form>